<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        textarea {
            width: 90%;
            height: 40vh;
            display: block;
            margin: 10px auto;
        }
    </style>
</head>

<body>
    <h1>rem转vw</h1>
    <textarea class="rem" name="rem" id="" cols="30" rows="10" placeholder="粘贴rem的css代码，需去掉@import './rem.scss';"
        oninput="startRemToVw()"></textarea>
    <textarea class="vw" name="rem" id="" cols="30" rows="10" placeholder="输出的vw代码"></textarea>
    <script>
        const elrem = document.querySelector('.rem');
        const elvw = document.querySelector('.vw');
        function startRemToVw() {
            const vw = elrem.value.replace(/(\d+)rem/g, (match, p1) => {
                return `${(p1 / 7.5).toFixed(2)}vw`
            })
            elvw.value = vw;
        }
    </script>
</body>

</html>